import React, { useEffect } from 'react'
import Father from './components/Father'
// 1. 安装
// 2. 导入
import PubSub from 'pubsub-js';
// 谁接收消息，谁订阅
export default function App() {
    let fanId = null;
    // componentDidMount
    useEffect(() => {
        // 订阅凡凡消息
        fanId = PubSub.subscribe('fanfan', (msg, data) => {
            console.log('App msg: ', msg);
            console.log('App data: ', data);
        })

        // fengfeng
        let fengId = PubSub.subscribe('fengfeng', (msg, data) => {
            console.log('App msg: ', msg);
            console.log('App data: ', data);
        })
        return () => {
            PubSub.unsubscribe(fanId);// 组件销毁前取消订阅
            PubSub.unsubscribe(fengId);
        }
    }, []);
    return (
        <div>
            <h3>App</h3>
            <button onClick={() => {
                PubSub.unsubscribe(fanId)
            }}>取消爷爷自己对凡凡的消息</button>

            <button onClick={() => {
                PubSub.unsubscribe('fanfan')
            }}>封杀凡凡的消息</button>

            <button onClick={() => {
                PubSub.clearAllSubscriptions();
            }}>封杀所有渣男</button>
            <hr />
            <Father />
        </div>
    )
}
